<template>
  {{ state.count }} <button @click="handleAddCounter">自增</button>
  <inc-btn @add="handleAddCounter"></inc-btn>
</template>

<script>
import { reactive } from "vue";
import IncBtn from "./IncBtn.Vue";

export default {
  name: "Counter",
  components: { IncBtn },
  setup() {
    const state = reactive({
      count: 0,
    });
    const handleAddCounter = () => {
      state.count += 1;
    };
    return {
      handleAddCounter,
      state,
    };
  },
};
</script>

<style scoped></style>
